import { computed } from "vue";
import { useDark } from "@pureadmin/utils";
import { AdStatus } from "./utils/types";

export function useAdHook() {
  const { isDark } = useDark();

  const switchStyle = computed(() => {
    return {
      "--el-switch-on-color": "#13ce66",
      "--el-switch-off-color": "#ff4949"
    };
  });

  const tagStyle = computed(() => {
    return (status: number) => {
      return {
        "--el-tag-text-color": isDark.value ? "#fff" : "#000",
        "--el-tag-bg-color": isDark.value
          ? getStatusDarkColor(status)
          : getStatusLightColor(status),
        "--el-tag-border-color": isDark.value
          ? getStatusDarkColor(status)
          : getStatusLightColor(status)
      };
    };
  });

  const getStatusColor = (status: number) => {
    switch (status) {
      case AdStatus.DRAFT:
        return "#909399";
      case AdStatus.ACTIVE:
        return "#67c23a";
      case AdStatus.PAUSED:
        return "#e6a23c";
      case AdStatus.ENDED:
        return "#f56c6c";
      default:
        return "#909399";
    }
  };

  const getStatusLightColor = (status: number) => {
    switch (status) {
      case AdStatus.DRAFT:
        return "#f4f4f5";
      case AdStatus.ACTIVE:
        return "#f0f9ff";
      case AdStatus.PAUSED:
        return "#fdf6ec";
      case AdStatus.ENDED:
        return "#fef0f0";
      default:
        return "#f4f4f5";
    }
  };

  const getStatusDarkColor = (status: number) => {
    switch (status) {
      case AdStatus.DRAFT:
        return "#262727";
      case AdStatus.ACTIVE:
        return "#1f2937";
      case AdStatus.PAUSED:
        return "#2d2a1f";
      case AdStatus.ENDED:
        return "#2d1b1b";
      default:
        return "#262727";
    }
  };

  const getStatusTagType = (status: number) => {
    switch (status) {
      case AdStatus.DRAFT:
        return "info";
      case AdStatus.ACTIVE:
        return "success";
      case AdStatus.PAUSED:
        return "warning";
      case AdStatus.ENDED:
        return "danger";
      default:
        return "info";
    }
  };

  const getPositionStatusTagType = (status: number) => {
    switch (status) {
      case 0:
        return "danger";
      case 1:
        return "success";
      default:
        return "info";
    }
  };

  const getTypeTagType = (type: number) => {
    switch (type) {
      case 1: // 图片广告
        return "primary";
      case 2: // 文字广告
        return "success";
      case 3: // 视频广告
        return "warning";
      case 4: // 轮播广告
        return "danger";
      default:
        return "info";
    }
  };

  const getPositionTypeTagType = (type: number) => {
    switch (type) {
      case 1: // 横幅广告
        return "primary";
      case 2: // 侧边栏广告
        return "success";
      case 3: // 弹窗广告
        return "warning";
      case 4: // 浮动广告
        return "danger";
      case 5: // 内容广告
        return "info";
      default:
        return "";
    }
  };

  return {
    switchStyle,
    tagStyle,
    getStatusColor,
    getStatusTagType,
    getPositionStatusTagType,
    getTypeTagType,
    getPositionTypeTagType
  };
}